<!--
 * @页面名称: 模式5
 * @描述: 有文件,全文
 * @作者: 辛慰
 * @Date: 2020-07-31 12:00:08
-->
<template>
  <div class="mode-five">
    <!-- 左侧树 -->
    <left-tree
      :tabList="tabList"
      :isShowLeftTree.sync="isShowLeftTree"
      :treeData="treeData">
    </left-tree>
    <!-- 文件模块 -->
    <div class="right-table" :style="{width: (isShowLeftTree ? 'calc(100% - 2px)': '82%')}">
      <file-card
        @textTable="textTable"
        @fileClick="fileButtonClick"></file-card>
    </div>
  </div>
</template>

<script>
import { LeftTree, FileCard } from '@/views/dynamic/components'
export default {
  name: '',
  components: {
    LeftTree,
    FileCard
  },
  data () {
    return {
      tabList: [],
      isShowLeftTree: false, // 是否显示左侧数据
      treeData: [ // 左侧树
        {
          title: '（XZ）行政以件管理',
          key: '1',
          children: [
            { title: '（XZ11）行政综合', key: '1-0' },
            { title: '（XZ12）人事', key: '1-1' },
            { title: '（XZ13）审计监察', key: '1-2' },
            { title: '（XZ14）武装保卫', key: '1-3' },
            { title: '（XZ15）后勤服务保障中心', key: '1-4' },
            { title: '（XZ16）档案，图书', key: '1-5' },
            { title: '（XZ17）退休工作', key: '1-6' },
            { title: '（XZ18）学生工作', key: '1-7' }
          ]
        }
      ]
    }
  },
  created () {
  },
  mounted () {
  },
  methods: {
    // 文件表格事件
    fileButtonClick (val) {
      console.log(val)
      switch (val) {
        case '添加文件':
          this.$parent.dynamicModal.title = '添加文件'
          this.$parent.dynamicModal.visible = true
          break
        case '修改文件':
          this.$parent.dynamicModal.title = '修改文件'
          this.$parent.dynamicModal.visible = true
          break
        case '删除文件':
          var this_ = this
          this.$confirm({
            title: '提示',
            content: '此操作将永久删除该文件, 是否继续?',
            okText: '确认',
            cancelText: '取消',
            onOk () {
              this_.$message.success('删除成功')
            }
          })
          break
        case '克隆新增':
          this.$parent.dynamicModal.title = '克隆新增'
          this.$parent.dynamicModal.visible = true
          break
        case '标记备注':
          this.$parent.markModal.title = '文件标记'
          this.$parent.markModal.visible = true
          break
        case '修改分类':
          this.$parent.classModal.visible = true
          break
        case '四性检测':
          this.$parent.checkModal.visible = true
          break
        case '简易搜索':
          this.$parent.simpleModal.visible = true
          break
        case '修改轨迹':
          this.$parent.logModal.visible = true
          break
      }
    },
    textTable () {
      this.$parent.textTable.visible = true
    }
  }
}
</script>
<style lang="less" scoped>
.mode-five {
  height: 100%;
  display: flex;
  .right-table {
    transition: all 0.2s;
  }
}
</style>
